<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>地平线生活服务</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>

    <link rel="stylesheet" href="/static/style/ydui.css"/>
    <script src="/static/js/ydui.flexible.js"></script>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js" type="text/javascript" charset="utf-8"></script>
	<script>
		wx.config(
			{$wxConfig}
		);
		wx.ready(function(){
			wx.hideOptionMenu();
		})
	</script>
</head>
<style>
	
    .login_form{margin:0.48rem 0.24rem;background-color: #fff;}
	.active{color:#FF5E53}
</style>
<body>
<section class="g-flexview">
		<header class="m-navbar">
			<div class="navbar-center"><span class="navbar-title">手机号登录</span></div>
		</header>
	<div class="g-scrollview">
		<form class="login_form">
			<div class="m-cell">
				<div class="cell-item">
					<div class="cell-left"><i class="cell-icon demo-icons-phone active"></i></div>
					<div class="cell-right">
						<input id="phone" name="login_phone" type="number" pattern="[0-9]*" class="cell-input" placeholder="请输入手机号码" autocomplete="off" />
					</div>
				</div>
			</div>
			<div class="m-cell">
				<div class="cell-item">
					<div class="cell-left"><i class="cell-icon icon-shield active"></i></div>
					<div class="cell-right">
						<input type="number" id="verfily" name="verfily" pattern="[0-9]*" class="cell-input" placeholder="验证码" autocomplete="off" />
						<a href="javascript:;" class="btn btn-warning" id="J_GetCode">获取短信验证码</a>
					</div>
				</div>
			</div>
			<a href="javascript:;" id="submitBtn" class="btn btn-block btn-danger">登录</a>
		</form>
    </div>
</section>
<script src="/static/js/jquery.js"></script>
<script src="/static/js/ydui.js"></script>
<script>
    !function (win, $) {

        var dialog = win.YDUI.dialog;

        var $getCode = $('#J_GetCode');

        // 定义参数
        $getCode.sendCode({
            disClass: 'btn-disabled', // 禁用按钮样式【必填】
            secs: 60, // 倒计时时长 [可选，默认：60秒]
            run: false,// 是否初始化自动运行 [可选，默认：false]
            runStr: '{%s}秒后重新获取',// 倒计时显示文本 [可选，默认：58秒后重新获取]
            resetStr: '获取验证码'// 倒计时结束后按钮显示文本 [可选，默认：重新获取验证码]
        });

        $getCode.on('click', function () {
			let val = $('#phone').val();
			let verfily = $('#verfily').val();
			var regExp = /^1[3456789]\d{9}$/;
			if(val==''){
				dialog.toast('请输入手机号', 'error', 1500);
				return false;
			}
			if(!regExp.test(val)){
				dialog.toast('手机号格式错误', 'error', 1500);
				return false;
			}
            var $this = $(this);
            dialog.loading.open('发送中...');
			$.post("{:url('common/send')}",{"mobile":val,"is_verify":"1"},function(rlt){
				dialog.loading.close();
                $this.sendCode('start');
				if(rlt.code == '300'){
					dialog.confirm('问题提示', '此手机号未注册，请先注册', function () {
						window.location.href="https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx5197fda6a99985bd&redirect_uri=https%3A%2F%2Flife.lifecloud.top%2Fapi%2Fmpwechat%2Foauth%2Fskip%2Fregister_index&response_type=code&scope=snsapi_userinfo&state=login&connect_redirect=1#wechat_redirect";
					});
				}
			})
        });
		$('#submitBtn').on('click',function(){
			let val = $('#phone').val();
			let verfily = $('#verfily').val();
			var regExp = /^1[3456789]\d{9}$/;
			if(val==''){
				dialog.toast('请输入手机号', 'error', 1500);
				return false;
			}
			if(!regExp.test(val)){
				dialog.toast('手机号格式错误', 'error', 1500);
				return false;
			}
			if(verfily == ''){
				dialog.toast('请输入验证码', 'error', 1500);
				return false;
			}
			$.post("{:url('common/login')}",{"mobile":val,"verify":verfily},function(rlt){
				if(rlt.code == '1'){
					dialog.toast('登录成功');
					setTimeout(function () { //模拟ajax发送
						window.location.reload();
            		}, 1000);
				}else{
					dialog.toast(rlt.msg, 'error', 1500);
				}
			})
			return false;
		})
    }(window, jQuery);
</script>
</body>
</html>